<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			function jiSuan() {
				// 首先拿到第一个input框里面的值
				var input1 = document.getElementById('input1');
				// 首先拿到第二个input框里面的值
				var input2 = document.getElementById('input2');
				// 在input框里面即使输入的是数字但是拿到的是以字符串形式返回
				// '12' + '10' : '1210
				// var result = input1.value + input2.value;
				
				// parseInt('12') parse:解析
				// 12 + 10 ： 22
				var result = parseInt(input1.value) + parseInt(input2.value);
				console.log(result);
				var resultSpan = document.getElementById('resultId');
				// 把计算的结果通过innerHtml把右边的内容放到标签中间
				resultSpan.innerHTML = result;
				
				var resultInput = document.getElementById('resultId2');
				// 把值放到input标签里面
				resultInput.value = result;
			}
		</script>
	</head>
	<body>
		<input type="text" id="input1"/> +
		<input type="text" id="input2" /> = 
		<span id="resultId"></span>
		<input type="text" id="resultId2" readonly=""/>
		<br/>
		<button onclick="jiSuan()">计算</button>
	</body>
</html>
